<template>
	<div class="toast" v-if="msg">
		{{msg}}
	</div>
</template>

<script>
	export default {
		data() {
			return {
				msg: ""
			} //提示的文本
		},
		methods: {
			show(str = "加载中", seconds = 2000) {
				this.msg = str;
				// 等两秒后隐藏
				setTimeout(() => this.hide(), seconds);
			},
			hide() {
				this.msg = "";
			}
		}
	}
</script>

<style scoped="scoped">
	.toast {
		position: fixed;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		padding: 15px;
		border-radius: 4px;
		color: #000;
		background-color: rgba(0, 0, 0, 0.3);
	}
</style>
